import React, { useState } from 'react';
import './index.scss';
import { useNavigate } from 'react-router-dom';
import { Menu } from 'antd';

const items = [
  {
    label: '首页',
    path: 'home',
    key: 'home'
  },
  {
    label: '关于我们',
    path: 'about-us',
    key: 'about-us',
    children: [
      {
        label: '公司简介',
        path: 'introduction',
        key: 'introduction'
      },
      {
        label: '发展历程',
        path: 'development-history',
        key: 'development-history'
      }
    ]
  },
  {
    label: '新闻中心',
    path: 'news-center',
    key: 'news-center',
    children: [
      {
        label: '公司动态',
        path: 'company-news',
        key: 'company-news'
      },
      {
        label: '行业动态',
        path: 'industry-news',
        key: 'industry-news'
      }
    ]
  },
  {
    label: '企业文化',
    path: 'enterprise-culture',
    key: 'enterprise-culture'
  },

  {
    label: '联系我们',
    path: 'contact-us',
    key: 'contact-us'
  }
];

export default function MenuList() {
  const [current, setCurrent] = useState('mail');
  const navigate = useNavigate();
  /**
   * @description: 每个菜单点击
   * @param {*} item
   * @return {*}
   * @author: lg
   */ const handleMenuItemClick = (item) => {
    console.log('每个菜单点击', item);
    // if(item.keyPath?.length)
    navigate(item.keyPath.reverse().join('/'));
    setCurrent(item.key);
  };
  return (
    <Menu
      className="menu-list"
      onClick={handleMenuItemClick}
      selectedKeys={[current]}
      mode="horizontal"
      items={items}
    />
  );
}
